<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>元素随意拖拽的实现 >> 张鑫旭-鑫空间-鑫生活</title>
<style type="text/css">
#box{position:absolute; left:100px; top:100px; padding:5px; background:#f0f3f9; font-size:12px; -moz-box-shadow:2px 2px 4px #666666; -webkit-box-shadow:2px 2px 4px #666666;}
#main{border:1px solid #a0b3d6; background:white;}
#bar{line-height:24px; background:#beceeb; border-bottom:1px solid #a0b3d6; padding-left:5px; cursor:move;}
#content{width:420px; height:250px; padding:10px 5px;}
</style>
</head>

<body>
<div id="box">
	<div id="main">
    	<div id="bar">拖拽</div>
        <div id="content">
        	内容……
        </div>
    </div>
</div>
<script type="text/javascript" src="drag.js"></script>
<script type="text/javascript">
window.onload = function(){
	var oBox = document.getElementById("box");
	var oBar = document.getElementById("bar");
	startDrag(oBar, oBox);
	//startDrag(触发拖拽对象，被拖拽对象)
};
</script>
</body>
</html>
